/*
 * @Description: pdf file 预览
 * @Author: Rfan
 * @Date: 2022-03-01 15:08:23
 * @LastEditTime: 2023-01-31 16:23:24
 */

import classNames from 'classnames/bind';
import { Image } from 'antd';
import styles from '../styles/pdfViewer.module.scss';
// eslint-disable-next-line react/jsx-no-undef
import 'react-image-gallery/styles/scss/image-gallery.scss';
import ImageGallery from 'react-image-gallery';
import { useEffect, useState } from 'react';
const cx = classNames.bind(styles);

interface IImageViewerProps {
  selectItem: any;
}

const ImageViewer = (props: IImageViewerProps) => {
  const { selectItem } = props;
  const [images, setImages] = useState([]);
  useEffect(() => {
    if (selectItem.ab) {
      setImages([
        {
          original: selectItem.preview_url || selectItem.file_url,
          thumbnail: selectItem.preview_url || selectItem.file_url
        },
        {
          original: selectItem.preview_url || selectItem.file_url,
          thumbnail: selectItem.preview_url || selectItem.file_url
        },
        {
          original: selectItem.preview_url || selectItem.file_url,
          thumbnail: selectItem.preview_url || selectItem.file_url
        }
      ]);
    }
  }, [selectItem]);

  return (
    <div className={cx('image-viewer')}>
      {selectItem.ab ? (
        <ImageGallery items={images} />
      ) : (
        <Image src={selectItem.preview_url || selectItem.file_url} />
      )}
    </div>
  );
};

export default ImageViewer;
